<div ng-controller="app">

<!-- contain BEGIN -->
    <div class="right-product right-full">
        <div class="center-back right-back">
            <div class="container-fluid">
                <div class="info-center">
                    <div class="page-header">
                        <div class="pull-left">
                            <h4>应用列表</h4>
                        </div>
                    </div>

                    <div class="search-box row">
                        <div class="col-md-1">
                            <button type="button" class="btn btn-default" ng-click="newlyAdded($event)" data-toggle="modal" data-target="#newlyAdded">
                                <span class="glyphicon glyphicon-plus"></span> 新增
                            </button>
                        </div>
                    </div>

                    <div class="clearfix"></div>

                    <div class="table-margin">
                        <table class="table table-bordered table-header">
                            <thead>
                                <tr>
                                    <td class="w10 text-center">应用Id</td>
                                    <td class="w10 text-center">应用名称</td>
                                    <td class="w10 text-center">应用URL</td>
                                    <td class="w10 text-center">授权范围</td>
                                    <td class="w10 text-center">应用类型</td>
                                    <td class="w10 text-center">应用唯一标识</td>
                                    <td class="w10 text-center">状态</td>
                                    <td class="w10 text-center">操作</td>
                                </tr>
                            </thead>
                            <tbody>
                                <tr ng-repeat="val in tabVal">
                                    <td class="text-center">{{ val.appId }}</td>
                                    <td class="text-center">{{ val.appName }}</td>
                                    <td class="text-center">{{ val.appUri }}</td>
                                    <td class="text-center">{{ val.scope }}</td>
                                    
                                    <td class="text-center">{{ val.appType }}</td>
                                    <td class="text-center">{{ val.appKey }}</td>
                                    <td class="text-center">{{ val.status }}</td>

                                    <td class="text-center icon-td">
                                        <i class="icon-details" ng-click="details($event, $index)" data-toggle="modal" data-target="#details"></i>
                                        <i class="icon-edit"    ng-click="edit($event, $index)"    data-toggle="modal" data-target="#edit"></i>
                                        <i class="icon-delete"  ng-click="delete($event, $index)"  data-toggle="modal" data-target="#delete"></i>
                                    </td>
                                </tr>
                            </tbody>
                            <tfoot>
                                <tr>
                                    <td colspan="12">
                                        <div class="pull-right">
                                            <nav>
                                                <tm-pagination conf="paginationConf"></tm-pagination>
                                            </nav>
                                        </div>
                                    </td>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>




<!-- contain END -->

<!-- 新增 BEGIN -->
    <div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" id="newlyAdded">
        <div class="modal-dialog " role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">新增应用</h4>
                </div>
                <div class="modal-body">
                    <form name="appAdd_form" novalidate>
                        <div class="form-group">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">应用图片-Web站点</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="file" 
                                       name="appImage" 
                                       ng-model="details_app_image" 
                                       />
                                                                
                            </div>
                        </div>
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">应用名称</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="appName" 
                                       class="form-control" 
                                       ng-model="details_app_name" 
                                       required 
                                       />
                                <label class="red required">*</label>
                                <div class="error" ng-show="appAdd_form.appName.$dirty && appAdd_form.appName.$invalid">
                                    <small class="error" ng-show="appAdd_form.appName.$error.required">请输入应用名称</small>
                                </div>
                            </div>
                        </div>
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">应用唯一标识</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="appKey" 
                                       class="form-control" 
                                       ng-model="details_app_key" 
                                        
                                       />
                                
                                
                            </div>
                        </div>
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">应用密钥</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="appSecret" 
                                       class="form-control" 
                                       ng-model="details_app_secret" 
                                        
                                       />
                                       <button type="button">重新生成密钥</button>
                               
                            </div>
                        </div>
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">应用URL</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="appUri" 
                                       class="form-control" 
                                       ng-model="details_app_url" 
                                       required 
                                       />
                                <label class="red required">*</label>
                                <div class="error" ng-show="appAdd_form.appUri.$dirty && appAdd_form.appUri.$invalid">
                                    <small class="error" ng-show="appAdd_form.appUri.$error.required">应用URL不能为空</small>
                                    <small class="error" ng-show="appAdd_form.appUri.$error.pattern">请输入正确的资源服务URL</small>
                                </div>
                            </div>
                        </div>
                         <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">应用Ip地址</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="appIp" 
                                       class="form-control" 
                                       ng-model="details_app_ip" 
                                       required 
                                       />
                                <label class="red required">*</label>
                                <div class="error" ng-show="appAdd_form.appIp.$dirty && appAdd_form.appIp.$invalid">
                                    <small class="error" ng-show="appAdd_form.appIp.$error.required">应用Ip不能为空</small>
                                    <small class="error" ng-show="appAdd_form.appIp.$error.pattern">请输入正确的应用Ip地址</small>
                                </div>
                            </div>
                        </div>
                        <div class="form-group height-auto">
                                <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">授权范围</label>   
                                <div class="col-xs-12 col-sm-9" >
                                    <div class="col-sm-4" ng-repeat="code in details_code">
                                        <input type="checkbox" name="scope"  />
                                        <label ng-bind="code"></label>
                                    </div>
                                </div>
                              </div>

                     
                        <div class="form-group height-auto">
                                <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">应用类型</label>   
                                <div class="col-xs-12 col-sm-9">
                                    <select ng-model="details_app_type" 
                                            class="form-control"  
                                            >
                                        <option id="" value="">请选择</option>
                                        <option id="" value="0">普通应用</option>
                                        <option id="" value="1" >内部站点</option>
                                    </select>
                                </div>
                              </div>  
                              <div class="form-group height-auto">
                                <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">授权类型</label>   
                                <div class="col-xs-12 col-sm-9">
                                    <select ng-model="details_auth_type" 
                                            class="form-control"  
                                            >
                                        <option id="" value="">请选择</option>
                                        <option id="" value="0">系统授权</option>
                                        <option id="" value="1" >用户授权</option>
                                    </select>
                                </div>
                              </div> 
                                <div class="form-group height-auto">
                                <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">认证授权类型</label>   
                                <div class="col-xs-12 col-sm-9">

                                    <input type="checkbox" 
                                           name="responseType" 
                                           ng-model="details_response_type" 
                                       
                                       />code
                                </div>
                              </div> 
                              <div class="form-group height-auto">
                                <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">许可类型</label>   
                                <div class="col-xs-12 col-sm-9">
                                    <!-- ng-repeat="granttype in details_grant_type" -->
                                    <div class="col-sm-6" ng-repeat="granttype in details_grant_types">
                                          <input type="checkbox" name="grantType"  />
                                          <label ng-bind="granttype"></label>
                                    </div>
                                </div>
                              </div> 
                              <div class="form-group height-auto">
                                <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">状态</label>   
                                <div class="col-xs-12 col-sm-9">
                                    <select ng-model="details_status" 
                                            class="form-control"  
                                            >
                                        <option id="" value="">请选择</option>
                                        <option id="" value="0">待审核</option>
                                        <option id="" value="1" >正常</option>
                                        <option id="" value="2" >冻结</option>
                                        <option id="" value="2" >逻辑删除</option>
                                        <option id="" value="2" >不合格</option>
                                    </select>
                                </div>
                              </div> 
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right">应用简介</label>
                            <div class="col-xs-12 col-sm-9">
                                <input
                                          type="text"
                                          name="appSummary" 
                                          class="form-control" 
                                          ng-model="details_app_summary"
                                          >
                                
                            </div>
                        </div>


                    </form>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                        <button type="button" class="btn btn-primary" data-dismiss="modal" ng-disabled="appAdd_form.$invalid" ng-click="confirmNewlyAdded()">确定</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
<!-- 新增 END -->








<!-- 详情 BEGIN -->
    <div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" id="details">
        <div class="modal-dialog " role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">应用详细信息</h4>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">应用Id：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="appId" 
                               class="form-control" 
                               ng-model="details_app_id" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">应用图片：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="appImage" 
                               class="form-control" 
                               ng-model="details_app_image" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">应用名称：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="appName" 
                               class="form-control" 
                               ng-model="details_app_name" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">应用唯一标识：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="appKey" 
                               class="form-control" 
                               ng-model="details_app_key" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">应用密钥：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="appSecret" 
                               class="form-control" 
                               ng-model="details_app_secret" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">应用URL：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="appUri" 
                               class="form-control" 
                               ng-model="details_app_url" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">应用Ip地址：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="appIp" 
                               class="form-control" 
                               ng-model="details_app_ip" 
                               disabled 
                               />
                               </div>
                    </div>
                     <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">授权范围：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="scope" 
                               class="form-control" 
                               ng-model="details_scope" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">应用类型：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="appType" 
                               class="form-control" 
                               ng-model="details_app_type" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">授权类型：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="authType" 
                               class="form-control" 
                               ng-model="details_auth_type" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">认证授权类型：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="responseType" 
                               class="form-control" 
                               ng-model="details_response_type" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">许可类型：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="grantType" 
                               class="form-control" 
                               ng-model="details_grant_type" 
                               disabled 
                               />
                               </div>
                    </div>
                     <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">状态：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="status" 
                               class="form-control" 
                               ng-model="details_status" 
                               disabled 
                               />
                               </div>
                    </div>
                     <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">应用简介：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="appSummary" 
                               class="form-control" 
                               ng-model="details_app_summary" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">返回列表</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
<!-- 详情 END -->

<!-- 修改 BEGIN -->
    <div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" id="edit">
        <div class="modal-dialog " role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">修改应用</h4>
                </div>
                <div class="modal-body">
                     <form name="appUpdate_form" novalidate>
                            <div class="form-group">
                                <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">应用图片</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="file" 
                                       name="appImage"  
                                       ng-model="details_app_image" 
                                       />
                                <label class="red required">*</label>
                            </div>
                        </div>
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">应用名称</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="appName" 
                                       class="form-control" 
                                       ng-model="details_app_name" 
                                       required 
                                       />
                                <label class="red required">*</label>
                                <div class="error" ng-show="appUpdate_form.appName.$dirty && appUpdate_form.appName.$invalid">
                                    <small class="error" ng-show="appUpdate_form.appName.$error.required">请输入应用名称</small>
                                </div>
                            </div>
                        </div>
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">应用唯一标识</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="appUri" 
                                       class="form-control" 
                                       ng-model="details_app_url" 
                                       required 
                                       />
                                <label class="red required">*</label>
                                <div class="error" ng-show="appUpdate_form.appUri.$dirty && appUpdate_form.appUri.$invalid">
                                    <small class="error" ng-show="appUpdate_form.appUri.$error.required">请输入应用URL</small>
                                </div>
                            </div>
                        </div>
                         <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">应用URL</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="appUri" 
                                       class="form-control" 
                                       ng-model="details_app_url" 
                                       required 
                                       />
                                <label class="red required">*</label>
                                <div class="error" ng-show="appUpdate_form.appUri.$dirty && appUpdate_form.appUri.$invalid">
                                    <small class="error" ng-show="appUpdate_form.appUri.$error.required">请输入应用URL</small>
                                </div>
                            </div>
                        </div>
                         <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">应用URL</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="appUri" 
                                       class="form-control" 
                                       ng-model="details_app_url" 
                                       required 
                                       />
                                <label class="red required">*</label>
                                <div class="error" ng-show="appUpdate_form.appUri.$dirty && appUpdate_form.appUri.$invalid">
                                    <small class="error" ng-show="appUpdate_form.appUri.$error.required">请输入应用URL</small>
                                </div>
                            </div>
                        </div>
                         <div class="form-group height-auto">
                                <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">应用类型</label>   
                                <div class="col-xs-12 col-sm-9">
                                    <div class="col-xs-12 col-sm-9">
                                    <select ng-model="details_app_type" 
                                            class="form-control" 
                                            ng-options="appType.id as appType.name for is_appType in which_appType">
                                    </select>
                       
                                </div>
                                </div>
                              </div>  
                               <div class="form-group height-auto">
                                <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">授权类型</label>   
                                <div class="col-xs-12 col-sm-9">
                                    <div class="col-xs-12 col-sm-9">
                                    <select ng-model="details_response_type" 
                                            class="form-control" 
                                            ng-options="responseType.id as responseType.name for is_retail in which_responseType">
                                    </select>
                       
                                </div>
                                </div>
                              </div>  
                        <div class="form-group height-auto">
                                <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">状态</label>   
                                <div class="col-xs-12 col-sm-9">
                                    <div class="col-xs-12 col-sm-9">
                                    <select ng-model="details_status" 
                                            class="form-control" 
                                            ng-options="status.id as status.name for is_retail in which_status">
                                    </select>
                       
                                </div>
                                </div>
                              </div>  
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right">应用简介</label>
                            <div class="col-xs-12 col-sm-9">
                                <input
                                          type="text" 
                                          name="appSummary" 
                                          class="form-control" 
                                          ng-model="details_appSummary"
                                          />
                                
                            </div>
                        </div>
                    </form>
                 </div>   
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary" data-dismiss="modal" ng-disabled="appUpdate_form.$invalid" ng-click="confirmEdit($event)">修改</button>
                </div>        
            </div>
        </div>
    </div>
<!-- 修改 END -->

<!-- 删除 BEGIN -->
    <div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" id="delete">
        <div class="modal-dialog delete-modal">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title text-center">删除警告</h4>
                </div>
                <div class="modal-body text-center">请确认是否删除该行应用管理</div>
                <div class="modal-footer">
                    <div class="col-md-6">
                        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    </div>
                    <div class="col-md-6">
                        <button type="button" class="btn btn-primary pull-left confirm-del-btn" ng-click="confirmDel()" data-dismiss="modal">确定</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
<!-- 删除 END -->
</div>

